<template>
    <div>
        <el-container>
             <el-aside>
                <el-avatar shape="circle" :size="250" fit="fill" :src="url"></el-avatar>
                <p style="margin-top:15px;">头像</p>
            </el-aside>
            <el-main class="info">
                <p>姓名:{{username}}</p>
                <p>班级:{{cla}}</p>
                <p>学号:{{num}}</p>
                <p>联系方式:{{contactInfo}}</p>
            </el-main>
        </el-container>
       
        
    </div>
</template>

<script>
export default {
    data(){
        return {
            //图片链接
            url:'',
            //姓名
            username:'',
            //学号
            num:'',
            //班级
            cla:'',
            //联系方式
            contactInfo:'',
        }
    },
    methods:{
        //获取个人信息
        getpersonal(){
            let num = sessionStorage.getItem('num');
            this.$axios.post('/guest/getuser',{num:num}).then((res)=>{
                this.url = res.data.result.hportrait;
                this.username = res.data.result.username;
                this.num = res.data.result.num;
                this.cla = res.data.result.cla;
                this.contactInfo = res.data.result.contactInfo;
            })
      },
    },
    //生命周期
    created(){
        this.getpersonal();
    }
}
</script>

<style scoped>
    .info p{
        text-align: left;
        font-size: 24px;
        text-indent: 3em;
        margin: 20px 0;
    }
</style>